<template>
  <view :class="['home-container flex-col', topBar.style]" v-if="showHome">
    <HomeNavBar @changeTab="changeTab" :tabs="tabs" :hot="hot" :tabIndex="tabIndex"></HomeNavBar>
    <view class="home-top-bg"></view>
    <swiper :current="tabIndex" @change="changeTab" style="flex:1" ref="swiper">
      <swiper-item v-for="tab in tabs" :key="tab.label">
        <Kemu1 :hot="hot" v-if="tab.kemu === 1" :kemu="1" @change="changeTab"></Kemu1>
        <Kemu2 :kemu="2" v-else-if="tab.kemu === 2" :item="tab"></Kemu2>
        <Kemu2 :kemu="3" v-else-if="tab.kemu === 3" :item="tab"></Kemu2>
        <Kemu4 :hot="hot" v-else-if="tab.kemu === 4"></Kemu4>
        <Kemu1 :hot="hot" v-if="tab.kemu === 5" :kemu="5" @change="changeTab"></Kemu1>
      </swiper-item>
    </swiper>
    <TiyanDialog ref="TiyanDialog"></TiyanDialog>
    <VIPQuanyiDialog ref="VIPQuanyiDialog"></VIPQuanyiDialog>
    <MessageCenter></MessageCenter>
    <BindPhoneDialog ref="BindPhoneDialog"></BindPhoneDialog>
    <UpdateDialog ref="UpdateDialog"></UpdateDialog>
    <LocationDialog ref="LocationDialog"></LocationDialog>
    <BindWxDialog ref="BindWxDialog"></BindWxDialog>
  </view>
</template>

<script>
import InviterDialog from '@/components/InviterDialog'
import LoginView from '@/components/LoginView/LoginView'
import {mapGetters, mapActions} from 'vuex'
import {commonApi, searchApi} from "@/api";
import MessageCenter from "@/components/MessageCenter";
import ReportDialog from "@/components/ReportDialog";
import Kemu1 from "@/pages/home/Kemu1.vue";
import Kemu2 from "@/pages/home/Kemu2.vue";
import HomeNavBar from "@/pages/home/HomeNavBar.vue";
import Kemu4 from "@/pages/home/Kemu4.vue";
import Navbar from "@/components/navbar.vue";
import TiyanDialog from "../../components/TiyanDialog.vue";
import SearchInput from "@/pages/home/SearchInput.vue";
import BindPhoneDialog from "@/components/BindPhoneDialog.vue";
import splashUtils from "@/libs/splashUtils";
import UpdateDialog from "@/components/UpdateDialog.vue";
import LocationDialog from "@/components/LocationDialog.vue";
import VIPQuanyiDialog from "@/components/VIPQuanyiDialog.vue";
import adUtils from "@/libs/adUtils";
import BindWxDialog from "../../components/BindWxDialog";

export default {
  props: ['from'],
  components: {
    BindWxDialog,
    VIPQuanyiDialog,
    LocationDialog,
    UpdateDialog,
    BindPhoneDialog,
    SearchInput,
    TiyanDialog,
    Navbar,
    LoginView,
    InviterDialog,
    Kemu1,
    Kemu2,
    Kemu4,
    HomeNavBar,
    MessageCenter,
    ReportDialog
  },
  data() {
    return {
      showHome: false,
      tabIndex: 0,
      hot: []
    }
  },
  computed: {
    ...mapGetters(['mine', 'appName', 'query', 'canPay', 'carType', 'isNewUser', 'topBar', 'haveVIP', 'selectedLocation', 'homePop', 'splashBuy', 'splashVIPAd', 'adChaping', 'needShowChapingAD', 'needShowKaipingAD']),
    ...mapGetters('args', ['homeNeedPushVIP']),
    tabs() {
      const kemu1 = {
        kemu: 1,
        label: '科目一'
      }
      const kemu4 = {
        kemu: 4,
        label: '科目四'
      }
      const list = [kemu1]

      if (this.carType === 1) {
        list.push({
          kemu: 2,
          label: '科目二'
        })
        list.push({
          kemu: 3,
          label: '科目三'
        })
      }
      list.push(kemu4)
      if (this.carType === 2) {
        list.push({
          kemu: 5,
          label: '满分学习'
        })
      }
      return list
    }
  },
  async created() {
    console.log('this.homeNeedPushVIP', this.homeNeedPushVIP, this.homePop)
    if (this.homeNeedPushVIP) {
      const splash = await splashUtils.autoShow()
      if (splash) {
        return
      }
    }

    this.showHome = true

    /*this.$nextTick(() => {
      this.$refs.LocationDialog.tryOpen()
    })*/
    uni.$on('changeCarType', this.changeCarType)
    setTimeout(() => {
      if (this.mine) {
        if (!this.haveVIP) {
          if (this.canPay) {
            if (this.homeNeedPushVIP || !this.splashBuy) {
              if (this.homePop === 1) {
                setTimeout(() => {
                  uni.navigateTo({
                    url: '/pages/vip/vip'
                  })
                }, 2000)

              } else if (this.homePop === 2) {
                this.$refs.VIPQuanyiDialog.open()
              }
            }
          }
        } else {
          this.showBindPhone()
        }
      }
      this.$refs.UpdateDialog.checkUpdate()
    }, 1000)

    setTimeout(() => {
      this.startChaping()
    }, 10 * 1000)

    searchApi.hotSearches().then(res => {
      this.hot = res.data.data.list
    })

    this.updateUserKemu()
  },
  destroyed() {
    uni.$off('changeCarType', this.changeCarType)
  },
  methods: {
    updateUserKemu() {
      if (this.tabs && this.tabs.length > this.tabIndex) {
        const {kemu = 1} = this.tabs[this.tabIndex]
        this.changeKemu(kemu)
      }
    },
    startChaping() {
      console.log('this.adChaping + 300', this.adChaping + 300)

      if (this.adChaping) {
        this.tryShowChaping()
        setInterval(() => {
          this.tryShowChaping()
        }, this.adChaping + 300)
      }
    },
    tryShowChaping() {
      if (this.needShowChapingAD) {
        adUtils.showChaPingAD()
      } else {
        console.log('没达标')
      }
    },
    changeCarType(c) {
      console.log('changeCarType', c)
      this.tabIndex = 0
    },
    ...mapActions(['refreshUser', 'changeKemu']),
    pageOnShow() {
      console.log('course home show')
      // this.showBindPhone()

      // #ifdef APP-PLUS
      this.refreshUser()
      if(this.haveVIP) {
        if(this.splashVIPAd) {
          plus.ad.setSplashAd(true)
        } else {
          plus.ad.setSplashAd(false)
        }
      } else {
        if (this.needShowKaipingAD) {
          plus.ad.setSplashAd(true)
        } else {
          plus.ad.setSplashAd(false)
        }
      }
      // #endif
    },
    //原来是让绑定手机号，现在改成绑定微信
    showBindPhone() {
      if (this.haveVIP) {
        if (!this.mine.phone && !this.mine.wxUnionId) {
          this.$refs.BindWxDialog && this.$refs.BindWxDialog.open()
        }
      }
    },
    changeTab(e) {
      this.tabIndex = e.detail.current
      this.updateUserKemu()
    },
    toSelectLocal() {
      uni.navigateTo({url: '/pages/select_local/select_local'})
    },
  }
}
</script>

<style lang="scss">
.home-container {
  height: 100%;
  background-color: #ffffff;

  .home-top-bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 500rpx;
    background-image: linear-gradient(10deg, #fff 0%, #deffff 95%);
  }
}
</style>
